<template>
  <div :class="$style.wrapper">
    <el-form label-position="top" label-width="auto">
      <el-row :key="rowIndex" v-for="(row, rowIndex) in rows" v-if="!showRowsCols">
        <el-col :key="colIndex" :span="colSpan(col)" v-for="(col, colIndex) in cols">
          <slot :name="row + '_' + col"></slot>
        </el-col>
      </el-row>

      <el-row :key="rowIndex" v-for="(row, rowIndex) in rowsCols" v-if="showRowsCols">
        <el-col :key="colIndex" :span="col" v-for="(col, colIndex) in row">
          <slot :name="(rowIndex + 1) + '_' + (colIndex + 1)"></slot>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>
<script>
/**
 * This is a component file.
 * Generate By lanaya-generate Automatically.
 * Author: Dennis
 * Date: 2020-7-29 14:2:31
 */
export default {
  name: 'SearchArea',
  props: {
    rowsCols: {
      type: Array
    },
    cols: {
      type: Number,
      default: 6
    },
    rows: {
      type: Number,
      default: 1
    }
  },
  computed: {
    showRowsCols () {
      return !!this.rowsCols;
    }
  },
  methods: {
    colSpan (col) {
      return parseInt(24 / this.cols);
    }
  }
};
</script>

<style lang="scss" module>
@import './../../../../src/style/default/SearchArea.scss';
</style>
